<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../../../static/layui/dist/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../../static/layui/dist/layuiadmin/style/admin.css" media="all">

  <script src="../js/jquery.min.js"></script>
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>


<div class="layui-btn-group demoTable">
  <button class="layui-btn" data-type="getCheckData" id="transmit">获取选中行数据</button>
  <button class="layui-btn" data-type="getCheckLength">获取选中数目</button>
  <button class="layui-btn" data-type="isAll">验证是否全选</button>
</div>

<div class="layui-fluid">
  <div class="layui-col-md12" style="height: 100%;">
    <table class="layui-table" lay-data="{width: 892, height:330, url:'portpage', page:true, id:'idTest'}" lay-filter="demo">
      <thead>
        <tr>
          <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
          <th lay-data="{field:'department',title:'部门',width:120,sort:true}">部门</th>
          <th lay-data="{field:'uid', title:'员工编号', width:100, unresize: true, sort: true}">ID</th>
          <th lay-data="{field:'user_name',title:'员工姓名',width:120,sort:true}">员工姓名</th>
          <th lay-data="{field:'department',title:'部门',width:120,sort:true}">部门</th>
          <th lay-data="{field:'report',title:'工作报告',width:300,sort:true}">工作报告</th>
          <th lay-data="{field:'created_time',title:'报告时间',width:200,sort:true}">报告时间</th>
          <th lay-data="{field:'updated_time',title:'修改时间',sort:true}">修改时间</th>
          <th lay-data="{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}"></th>
        </tr>
      </thead>
    </table>
  </div>
</div>





<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->

<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="../../../static/layui/dist/layuiadmin/layui/layui.all.js"></script>
<script>


layui.use(['table', 'layedit', 'laydate'], function(){
  var table = layui.table
  ,$ = layui.$;

  table.on('checkbox(demo)', function(obj){
    console.log(obj)
  });

  //方法级渲染
  // table.render({
  //   elem: '#LAY_table_user'
  //   ,url: 'portpage'
  //   ,cols:[[
  //       {type:'checkbox', fixed: 'left'},
  //       {field:'department',title:'部门',width:120,sort:true},
  //       {field:'uid', title:'员工编号', width:100, unresize: true, sort: true},
  //       {field:'user_name',title:'员工姓名',width:120,sort:true},
  //       {field:'department',title:'部门',width:120,sort:true},
  //       {field:'report',title:'工作报告',width:300,sort:true},
  //       {field:'created_time',title:'报告时间',width:200,sort:true},
  //       {field:'updated_time',title:'修改时间',sort:true},
  //       {field: 'right', title: '操作', width: 165, toolbar: "#barDemo",}
  //       ]]
  //   ,id: 'testReload'
  //   ,page: true
  //   ,limit:20
  //   ,
  // });

  table.on('tool(demo)', function(obj){
    var data = obj.data;
    if(obj.event === 'detail'){
      layui.use('layer', function(){
        alert('点击执行了')
        layer.open({
              type: 2,
              content: ["see?report=" + data.report],
              area: ["600px", "400px"],
              title: ['查看日志'],
              fixed: true,
              //maxmin: true,
              shadeClose: true,
              classBtn:1,
              end: function () {  //刷新页面
              location.reload();
              }
            })

  layer.msg('hello');
});
      // layer.msg('ID：'+ data.id + ' 的查看操作');
    } else if(obj.event === 'del'){
      layer.confirm('真的删除行么', {icon: 3, title:'提示'},function(index){
        obj.del();
        layer.close(index);
        var parmas = "report="+data.report;
          $.ajax({
          url:'/workreport/del',
          type:'post',
          data:parmas,
          success:function(res){
            alert(res);
              }
        })

      });
    } else if(obj.event === 'edit'){
      layer.open({
    type: 2,
    content: 'workreport/testlayer',
    success: function(layero, index){
        var body = layer.getChildFrame('body', index);
        var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
        console.log(body.html()) //得到iframe页的body内容
        body.find('input').val('给弹出层传值用的')
    }
    });

    }
  });


  var $ = layui.$, active = {
    reload: function(){
      var demoReload = $('#demoReload');

      //执行重载
      table.reload('testReload', {
        page: {
          curr: 1 //重新从第 1 页开始
        }
        ,where: {
          key: {
            id: demoReload.val()
          }
        }
      });
    }
  };
  
  var $ = layui.$, active = {
    getCheckData: function(){ //获取选中数据
      var checkStatus = table.checkStatus('idTest')
      ,data = checkStatus.data
      layer.alert(JSON.stringify(data));
      //向父页传输数据data
      var index = parent.layer.getFrameIndex(window.name);
      
        parent.layui.$('#test2').val(JSON.stringify(data));
        parent.layer.tips('Look here', '#parentIframe', {time: 5000});
        parent.layer.close(index);
      
    }
    ,getCheckLength: function(){ //获取选中数目
      var checkStatus = table.checkStatus('idTest')
      ,data = checkStatus.data;
      layer.msg('选中了：'+ data.length + ' 个');
    }
    ,isAll: function(){ //验证是否全选
      var checkStatus = table.checkStatus('idTest');
      layer.msg(checkStatus.isAll ? '全选': '未全选')
    }
  };

  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
});
</script>


</body>
</html>